<html>
	<head>
		<script type="text/javascript" src="/static/jqueryjquery-3.1.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function () {
                $("#connectReader").click(function () {
                    $.ajax({
                        type: 'GET',
                        url: '/connectUSB',
                        success: function (data) {
                            if(data==0) {
                                alert("连接成功");
                            }
                            if(data==-1){
                                alert("设备未连接");
                            }
                        }
                    });
                });
                $("#disconnectReader").click(function(){
                    $.ajax({
                        type:'GET',
                        url:'/disConnectReader/',
                        success:function(data){
                            if(data==0) {
                                alert("连接已断开");
                            }else{
                                alert("断开操作失败");
                            }
                        }
                    });
                });
                $("#readUserArea").click(function(){
                    $.ajax({
                        type:'POST',
                        url:'/readUserArea/',
                        success:function(data){
                            $("#encData").text(data);
                        }
                    });
                });
            });
		</script>
        <style>
           table {
            border-collapse: collapse;
            border-spacing: 0;
            }
            td, th {
            border: 1px solid blue;
            padding: 8px;
            }
        </style>
	</head>
	<body>
        <table>
            <tr>
                <td><input type="button" value="连接读卡器" id="connectReader"/></td>
                <td><input type="button" value="断开读卡器" id="disconnectReader"/></td>
            </tr>
        </table>
        <br>
        <div>
            <textarea cols="100" rows="5">
                424B2F774E7750372B7367416E67427653464F64375861334C55474374423033506431624A30433246772F2F6B7746646D5A59564F55455A31754939355A56575A53335761535664755372514254384C37582F63446E793257717672526975793368676B5679417A6363375A554157545462506458356B7169
            </textarea>
        </div>
        <br>
        <table>
            <tr>
                <td><input type="button" value="写入用户区" id="writeToUserArea"/></td>
                <td><input type="button" value="读取用户区" id="readUserArea"/></td>
            </tr>
        </table>
        <br>
        <textarea cols="100" rows="5" id="encData"></textarea>
	</body>
</html>